<template>
  <div class="app-container">
    <div class="filter-container">
      <el-select
        v-model="listQuery.button"
        clearable
        placeholder="状态"
        style="width: 150px;"
        class="filter-item"
      >
        <!-- <el-option label='全部'>全部</el-option> -->
        <el-option :value="1" label="开启">开启</el-option>
        <el-option :value="0" label="全部">全部</el-option>
      </el-select>
      <el-input
        v-model="listQuery.channel"
        placeholder="输入机构名称"
        style="width: 150px;"
        class="filter-item"
        @keyup.enter.native="handleFilter"
      />
      <el-date-picker
        v-model="times"
        class="filter-item"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        style="width: 250px;"
        type="daterange"
        value-format="yyyy-MM-dd"
      />
      <el-button
        v-waves
        class="filter-item"
        type="primary"
        icon="el-icon-search"
        @click="handleFilter"
      >
        搜索
      </el-button>
    </div>
    <el-table
      v-loading="listLoading"
      :data="tableData"
      border
      fit
      highlight-current-row
      style="width: 100%;"
    >
      <el-table-column label="日期" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.creat_time }}</span>
        </template>
      </el-table-column>
      <el-table-column label="机构名称" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.insurance_products_name }}</span>
        </template>
      </el-table-column>
      <el-table-column label="展示名称" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.channel }}</span>
        </template>
      </el-table-column>
      <el-table-column label="进件成功数" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.incomingSuccessNumber }}</span>
        </template>
      </el-table-column>
      <el-table-column label="进件成功率" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.incomingSuccessRate }}%</span>
        </template>
      </el-table-column>
      <el-table-column label="额度5万以上" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.quota }}</span>
        </template>
      </el-table-column>
      <el-table-column label="芝麻分650以上" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.score }}</span>
        </template>
      </el-table-column>
      <el-table-column label="有公积金" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.accumulation }}</span>
        </template>
      </el-table-column>
      <el-table-column label="有房" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.house }}</span>
        </template>
      </el-table-column>
      <el-table-column label="有车" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.car }}</span>
        </template>
      </el-table-column>
      <el-table-column label="个体户/企业主" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.isBusiness }}</span>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="listQuery.current"
      :limit.sync="listQuery.size"
      @pagination="getCityCount"
    />
  </div>
</template>

<script>
import { getinstitutionalSumInto } from '@/api/advertising';
import Pagination from '@/components/Pagination';
export default {
  name: 'CountChannel',
  components: { Pagination },
  data() {
    return {
      listQuery: {
        channel: '',
        city: '',
        current: 1,
        endTime: '',
        province: '',
        size: 10,
        startTime: '',
        button: 1
      },
      total: 0,
      tableData: [],
      tableData1: [],
      times: [],
      timeDefault: []
    };
  },
  created() {
    this.getCityCount(this.listQuery);
    this.defaultDate();
  },
  methods: {
    defaultDate() {
      let date = new Date();
      //获取当前时间的年份转为字符串
      let year = date.getFullYear().toString();
      //获取月份，由于月份从0开始，此处要加1，判断是否小于10，如果是在字符串前面拼接'0'
      let month =
        date.getMonth() + 1 < 10
          ? '0' + (date.getMonth() + 1).toString()
          : (date.getMonth() + 1).toString();
      //获取天，判断是否小于10，如果是在字符串前面拼接'0'
      let da =
        date.getDate() < 10
          ? '0' + date.getDate().toString()
          : date.getDate().toString();
      //字符串拼接，开始时间，结束时间
      let end = year + '-' + month + '-' + da; //当天
      let beg = year + '-' + month + '-' + da;
      this.times = [beg, end]; //将值设置给插件绑定的数据
      this.listQuery.startTime = end;
      this.listQuery.endTime = beg;
    },
    async getCityCount(listQuery) {
      const res = await getinstitutionalSumInto(this.listQuery);
      this.tableData = res.data.data.records;
      this.total = res.data.data.total;
    },
    handleFilter() {
      this.listQuery.current = 1;
      if (this.times == null) {
        this.listQuery.endTime = '';
        this.listQuery.startTime = '';
      } else if (this.times.length === 0) {
        this.listQuery.endTime = '';
        this.listQuery.startTime = '';
      } else {
        this.listQuery.endTime = this.times[1];
        this.listQuery.startTime = this.times[0];
      }
      this.getCityCount(this.listQuery);
    }
  }
};
</script>

<style lang="scss" scoped></style>
